<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>{$tpshop_config['shop_info_store_title']}</title>
    <meta http-equiv="keywords" content="{$tpshop_config['shop_info_store_keyword']}" />
    <meta name="description" content="{$tpshop_config['shop_info_store_desc']}" />
<link rel="stylesheet" href="__STATIC__/css/user.css" type="text/css">
    <script src="__STATIC__/js/jquery-1.10.2.min.js"></script>
    <script src="__STATIC__/js/slider.js"></script>
    <script src="__PUBLIC__/js/layer/layer.js"></script><!--弹窗js 参考文档 http://layer.layui.com/-->    
    <script src="__PUBLIC__/js/global.js"></script>
</head>

<body>
<include file="Public/header" />

<div id="user_container" style="background: #F5F5F5 url(__STATIC__/images/user_reg_bg.jpg) no-repeat bottom center;">
<div id="reg_container">
    <div class="ema-tel">
        <a class="ema-tab  tel-tab fr di-bl" href="#" id="tel_tab" onClick="reg_tab('tel_tab','ema_tab')">手機註冊</a>
        <a class="tel-tab fr di-bl" href="#" id="ema_tab" onClick="reg_tab('ema_tab','tel_tab')">郵箱註冊</a>
    </div>
    <!--邮箱注册-->
    <div class="shuru-area" id="ema_tab_div" style="display: none">
		
       	<div class="wel-log">郵箱註冊</div>
       <div class="login-x">
                <div>
            <form action="" method="post" onSubmit=" return check_submit(this)" id="reg_form">
                    <table class="pa-10-0" width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                        <td><input class="zc-text zc_u" type="text" name="username" id="username" placeholder="郵箱" /></td>
                    </tr>
                     <if condition="$regis_smtp_enable eq 1">
                         <tr>
                             <td  class="po-re">
                                 <input class="zc-text zc_code" name="code" id="code" type="text" placeholder="郵箱驗證碼" />
                                 <button type="button" class="po-ab to0" style="width: 105px;height:52px;margin-top:11px; border:none; background:#000; color:#fff;" id="count_down" onClick="send_smtp_reg_code()">發送</button>
                             </td>
                         </tr>
                     </if>
                    <tr>
                        <td>
                            <input class="zc-text zc_p" type="password" name="password" id="password" placeholder="密碼" maxlength="16" />
                            <!--<div class="pwd-letter">-->
                                <!--<span>弱</span>-->
                                <!--<span>中</span>-->
                                <!--<span>强</span>-->
                            <!--</div>-->
                        </td>
                    </tr>
                    <tr>
                        <td><input class="zc-text zc_p" type="password" name="password2" id="password2" placeholder="請重復輸入您的密碼" /></td>
                    </tr>
                    <tr>
                        <td  class="po-re">
                            <input class="zc-text zc_code" name="verify_code" id="verify_code" type="text" placeholder="驗證碼" />
                            <img id="verify_code_img" class="verify_code_img_reg" src="{:U('Home/User/verify',array('type'=>'user_reg'))}" onclick="verify('verify_code_img_reg')"  />
                        </td>
                    </tr>
                    <tr>
                        <td id="pa"><input class="checkboxs" name="agree" id="agree" type="checkbox" value="1"  style="vertical-align:middle;"/>&nbsp;&nbsp;<label for="agree">同意</label><a class="iages" href="{:U('Home/Article/detail/article_id/1')}">《帐号服务条款、隐私政策》</a>
						<div class="f_r_login">已有账号？&nbsp;&nbsp;<a href="{:U('Home/User/login')}">马上登录</a></div>
						</td>
                    </tr>
                    <tr>
                        <td><input type="submit" value="立即注册" class="loginreg"/></td>
                    </tr>
                </table>
        </form>
			</div>
        </div>
    </div>
    <!--邮箱注册-->
    <!--手机注册-->
    <div class="shuru-area" id="tel_tab_div">
       	<div class="wel-log">手機註冊</div>
        <div class="login-x">
                <div>
            <form action="" method="post" onSubmit=" return check_submit(this)" id="reg_form2">
                    <table class="pa-10-0" width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                        <td><input class="zc-text zc_u" type="text" name="username" id="username2" placeholder="手機號碼" maxlength="11" /></td>
                    </tr>
                    <if condition="$regis_sms_enable eq 1">
                    <tr>
                        <td  class="po-re">
                            <input class="zc-text zc_code" name="code" id="code" type="text" placeholder="手機驗證碼" />
                            <button type="button" class="po-ab to0"style="width: 105px;height:52px;margin-top:11px; border:none; background:#000; color:#fff;" id="count_down1" onClick="send_sms_reg_code()">發送</button>
                        </td>
                    </tr>
                    </if>
                    <tr>
                        <td>
                            <input class="zc-text zc_p" type="password" name="password" id="password3" placeholder="密碼" />
                            <!--<div class="pwd-letter">-->
                                <!--<span>弱</span>-->
                                <!--<span>中</span>-->
                                <!--<span>强</span>-->
                            <!--</div>-->
                        </td>
                    </tr>
                    <tr>
                        <td><input class="zc-text zc_p" type="password" name="password2" id="password4" placeholder="請重復輸入您的密碼" /></td>
                    </tr>
                    <tr>
                        <td  class="po-re">
                            <input class="zc-text zc_code" name="verify_code" id="verify_code2" type="text" placeholder="驗證碼" />
                            <img  id="verify_code_img1" class="verify_code_img_reg"  src="{:U('Home/User/verify',array('type'=>'user_reg'))}" onclick="verify('verify_code_img_reg')"  />
                        </td>
                    </tr>
                    <tr>
                        <td id="pa1"><input class="checkboxs" id="agree1" name="agree" type="checkbox" value="1"  style="vertical-align:middle;"/>&nbsp;&nbsp;<label for="agree">同意</label><a class="iages" href="{:U('Home/Article/detail/article_id/1')}">《帐号服务条款、隐私政策》</a>
						<div class="f_r_login">已有账号？&nbsp;&nbsp;<a href="{:U('Home/User/login')}">马上登录</a></div></td>
                    </tr>
                    <tr>
                        <td><input type="submit" value="立即注册" class="loginreg"/></td>
                    </tr>
                </table>
            </form>
			</div>
        </div>
       
    </div>

    <!--手机注册-->
</div>
</div>

<include file="Public/footer" />
<script>

    flag = true;
    $(document).ready(function(){
	
        $("input[name='username']").blur(function () {
            var username = $(this).val();
            var re = /^(13[0-9]{9})|(15[^4,\\D][0-9]{8})|(18[0-9]{9})|(17[0-9]{9})|((\w{1,20}@\w{1,20}.[a-z]{2,5}))$/;
            var id = $(this).attr("id");
            if (re.test(username)) {
                $.ajax({
                    type : "GET",
                    url:"/index.php?m=Home&c=Api&a=issetMobileOrEmail",//+tab,
                    data :{mobile:username},// 你的formid 搜索表单 序列化提交
                    success: function(data)
                    {
                        if(data != '0')
                        {
                            flag = false;
                        }else{
                            flag = true;
                        }
                    }
                });
            }else{
                flag = false;
            }
        })
    });
	// 普通 图形验证码 
    function verify(id){
        $('.'+id).attr('src','/index.php?m=Home&c=User&a=verify&type=user_reg&r='+Math.random());
      // $('#verify_code_img').attr('src','/index.php?m=Home&c=User&a=verify&r='+Math.random());
    }
    function check_submit(obj){

        var username = $(obj).find('input[name="username"]').val();
        var password = $(obj).find('input[name="password"]').val();
        var password2 = $(obj).find('input[name="password2"]').val();
        var verify_code = $(obj).find('input[name="verify_code"]').val();
        var agree = $(obj).find('input[type="checkbox"]:checked').val();
        var error = '';
        if(username == ''){
            //error += '用户名不能为空';
			$.artTip('用户名不能为空.', 800);
			return false;
        }
        if(password == '' || password2 == ''){
			$.artTip('密码不能为空.', 800);
			return false;
        }

        if(password !== password2){
			$.artTip('两次输入密码不一致.', 800);
			return false;
        }
        if(password.length < 6){
			
			$.artTip('密码长度不能低于六位.', 800);
			return false;
        }
        if(verify_code == ''){
			
			$.artTip('请输入验证码.', 800);
			return false;
        }
        if(!agree > 0){
			$.artTip('您没有同意注册协议.', 800);
			return false;
        }
        if(!flag){
			$.artTip('用户名已经被注册.', 800);
			return false;
        }
		/*
        if(error){
           layer.alert(error, {icon: 2});// alert(error);
            return false;
        }*/
        return true;
    }
	// 电子邮件注册  和 手机号码注册 切换
    function reg_tab(id,id2){
        $('#'+id).addClass('ema-tab');
        $('#'+id2).removeClass('ema-tab');
        $('#'+id+'_div').show();
        $('#'+id2+'_div').hide();
    }
	// 发送手机短信
    function send_sms_reg_code(){
        var mobile = $('#tel_tab_div').find('input[name="username"]').val();
        if(!checkMobile(mobile)){
           // layer.alert('请输入正确的手机号码', {icon: 2});// alert('请输入正确的手机号码');
			$.artTip('请输入正确的手机号码.', 800);
            return;
        }
        var url = "/index.php?m=Home&c=User&a=send_sms_reg_code&mobile="+mobile;
        $.get(url,function(data){
            obj = $.parseJSON(data);
            if(obj.status == 1)
			{
				$('#count_down1').attr("disabled","disabled");	
                $('#count_down1').css("background-color","#797979");			
				intAs = {$sms_time_out}; // 手机短信超时时间
                jsInnerTimeout('count_down1',intAs);						
			}
			//layer.alert(obj.msg, {icon: 1});// alert(obj.msg);
			
			$.artTip(obj.msg, 800);
            
        })
    }
    // 发送邮箱验证
    function send_smtp_reg_code(){
        var email = $('#ema_tab_div').find('input[name="username"]').val();
        if(!checkEmail(email)){
			$.artTip('请输入正确的邮箱.', 800);
           // layer.alert('请输入正确的邮箱', {icon: 2});// alert('请输入正确的手机号码');
            return;
        }
        $.ajax({
            type : "POST",
            url:"{:U('Home/User/send_validate_code')}",
            data : {type:'email',send:email},// 你的formid
            dataType: "json",
            success: function(data){
                if(data.status){
                    $('#count_down').attr("disabled","disabled");
                    $('#count_down').css("background-color","#797979");
                    intAs = {$sms_time_out}; // 发送邮箱
                    jsInnerTimeout('count_down',intAs);
                }
               // layer.alert(data.msg, {icon: 1});// alert(obj.msg);
				
				$.artTip(data.msg, 800);
            }
        });

    }

    $('#count_down1').removeAttr("disabled");
	$('#count_down').css("background-color","#000");
	$('#count_down1').css("background-color","#000");
    $('#count_down').removeAttr("disabled");
    //倒计时函数
    function jsInnerTimeout(id,intAs)
    {
        var codeObj=$("#"+id);
        //var intAs = parseInt(codeObj.attr("IntervalTime"));

        intAs--;
        if(intAs<=-1)
        {
            codeObj.removeAttr("disabled");
			codeObj.css("background-color","#000");
//            codeObj.attr("IntervalTime",60);
            codeObj.text("发送");
            return true;
        }

        codeObj.text(intAs+'秒');
//        codeObj.attr("IntervalTime",intAs);

        setTimeout("jsInnerTimeout('"+id+"',"+intAs+")",1000);
    };
</script>
</body>
</html>
